/*
    Copyright (c) Guangzhou Data Control Network Technology Co., Ltd. All rights reserved.
    Licensed under the MIT License.
    contact:dcdev_founder@foxmail.com
*/
(function (window, undefined) {
    popup_menu_class = {
        _popup_menu: function (data) {
            $("#_dc_popup_menu_mask_").css("display", "block");
            var dd_temp = "";
            for (let index = 0; index < data.dd_config.length; index++) {
                const element = data.dd_config[index];
                if (element.dd_text) {
                    dd_temp += `
<dd id="_dc_${data.id}_popup_menu_item${index}" class="_dc_${data.id}_popup_menu_item_" data-key="${element.dd_key}" data-index="${index}" data-text="${element.dd_text.text}" class="${element.dd_class}" style="${element.dd_style}">
    <img class="${element.dd_img.class ? element.dd_img.class : "dcdev-icon-btn"}" style="${element.dd_img.style}" src="${element.dd_img.src}" width="${element.dd_img.width ? element.dd_img.width : "20px"}">
    <a style="${element.dd_text.style ? element.dd_text.style + ";cursor: default;" : "cursor: default;"}line-height: 32px;" class="${element.dd_text.class}">${element.dd_text.text}</a>
</dd>`
                } else {
                    dd_temp += `<hr style="color:lightgray;margin-left:10px;">`;
                }

            }

            dl_temp =
                `<dl style='${data.dl_config.style}' class='${data.dl_config.class}'>${dd_temp}</dl>`;
            $("#_dc_popup_menu_list_").append(dl_temp);

            //设置点击行回调
            for (let index = 0; index < data.dd_config.length; index++) {
                // debugger;
                const element = data.dd_config[index];
                $(`#_dc_${data.id}_popup_menu_item${index}`).click(function () {
                    console.log(element)
                })
            }
            // for (let index = 0; index < data.dd_config.length; index++) {
            //     // debugger;
            //     const element = data.dd_config[index];
            //     $(`#_dc_menu_${data.id}_${index}`).click(function (_this) {
            //         debugger;
            //         if (data.click_cb) {
            //             data.click_cb({
            //                 key: $(this).data("key"),
            //                 index: $(this).data("index"),
            //                 text: $(this).data("text"),
            //             })
            //             $("#_dc_popup_menu_list_").html("");
            //         }
            //     })
            // }
        },
        popup_menu: function (data) {

            if (!window[`_dc_${data.id}_popup_menu_object_`]) {
                var that;
                var _dc_popup_menu_data_;

                // 赋值that，与函数内的this作区分
                that = this;
                // 保存传入的配置数据
                that._dc_popup_menu_data_ = data;
                // 保存全局变量数据
                window[`_dc_${that._dc_popup_menu_data_.id}_popup_menu_object_`] = that;
                // 根据全局变量数据
                window[`_dc_${that._dc_popup_menu_data_.id}_popup_menu_data_`] = data;

                // 未有菜单载体则动态添加
                if (!document.getElementById(`_dc_popup_menu_mask_`)) {
                    $("body").append(`<div id="_dc_popup_menu_mask_" style="width:100%;height:100%;top:0;position: absolute;"></div>`)
                }
                if (!document.getElementById(`_dc_popup_menu_list_`)) {
                    var left;
                    var top;
                    console.log()
                    // position: absolute;                    
                    switch (data.position) {
                        case "right":
                            top = document.getElementById(data.id).getBoundingClientRect().top + document.documentElement.scrollTop;
                            left = document.getElementById(data.id).getBoundingClientRect().left + document.documentElement.scrollLeft + document.getElementById(data.id).getBoundingClientRect().width;
                            $(document.getElementById(data.id).parentNode).append(`
                            <div id="_dc_popup_menu_list_" style="z-index:999;position:absolute;border: 1px solid #ddd;width:110px;top:${top}px;left:${left + 10}px"></div>`);
                            break;
                        case "left":
                            top = document.getElementById(data.id).getBoundingClientRect().top + document.documentElement.scrollTop;
                            left = document.getElementById(data.id).getBoundingClientRect().left + document.documentElement.scrollLeft - 120;
                            $(document.getElementById(data.id).parentNode).append(`
                            <div id="_dc_popup_menu_list_" style="z-index:999;position:absolute;border: 1px solid #ddd;width:110px;top:${top}px;left:${left}px"></div>`);
                            break;
                        case "top":
                            top = document.getElementById(data.id).getBoundingClientRect().top + document.documentElement.scrollTop - 160;
                            left = document.getElementById(data.id).getBoundingClientRect().left + document.documentElement.scrollLeft;
                            $(document.getElementById(data.id).parentNode).append(`
                            <div id="_dc_popup_menu_list_" style="z-index:999;position:absolute;border: 1px solid #ddd;width:110px;top:${top}px;left:${left}px"></div>`);
                            break;
                        case "bottom":
                            top = document.getElementById(data.id).getBoundingClientRect().top + document.documentElement.scrollTop + document.getElementById(data.id).getBoundingClientRect().height + 10;
                            left = document.getElementById(data.id).getBoundingClientRect().left + document.documentElement.scrollLeft;
                            $(document.getElementById(data.id).parentNode).append(`
                            <div id="_dc_popup_menu_list_" style="z-index:999;position:absolute;border: 1px solid #ddd;width:110px;top:${top}px;left:${left}px"></div>`);
                            break;
                        default:
                            break;
                    }
                    // switch (data.position) {
                    //     case "right":
                    //         $(document.getElementById(data.id).parentNode).append(`<div id="_dc_popup_menu_list_" style="margin-left:10px;border: 1px solid #ddd;width:110px;display: inline-flex;"></div>`);
                    //         break;
                    //     case "left":
                    //         $("#" + data.id).before(`<div id="_dc_popup_menu_list_" style="margin-right:10px;border: 1px solid #ddd;width:110px;float:left"></div>`);
                    //         break;
                    //     case "top":
                    //         $("#" + data.id).before(`<div id="_dc_popup_menu_list_" style="margin-bottom:10px;border: 1px solid #ddd;width:110px;"></div>`);
                    //         break;
                    //     case "bottom":
                    //         $(document.getElementById(data.id).parentNode).append(`<div id="_dc_popup_menu_list_" style="margin-top:10px;border: 1px solid #ddd;width:110px;"></div>`);
                    //         break;
                    //     default:
                    //         break;
                    // }
                }
                this._popup_menu(data);

                $(`._dc_${data.id}_popup_menu_item_`).click(function () {
                    // debugger;
                })

                $(`#${data.id}`).click(function () {
                    data = window[`_dc_${data.id}_popup_menu_data_`];
                    that = window[`_dc_${data.id}_popup_menu_object_`];
                    console.log(data, that);
                    that._popup_menu(data);
                })
                $(`#_dc_popup_menu_mask_`).click(function () {
                    $("#_dc_popup_menu_mask_").css("display", "none");
                    $("#_dc_popup_menu_list_").html("").css('border', '');
                })
            } else {
                $("#_dc_popup_menu_list_").html("").css('border', '1px solid #ddd');
            }
        },
        hide_menu: function () {
            // debugger;
            $("#_dc_popup_menu_list_").html("");
            $("#_dc_popup_menu_mask_").css("display", "none");
        }
    }

})(window);

